<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md8">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">用户数据统计</div>
                        <div class="layui-card-body">
                            <ul class="layui-row layui-col-space30">
                                <li class="layui-col-xs3">
                                    <a class="layadmin-backlog-body">
                                        <h3>今日新增</h3>
                                        <p><cite>{$usertol['today']}</cite></p>
                                    </a>
                                </li>
                                <li class="layui-col-xs3">
                                    <a class="layadmin-backlog-body">
                                        <h3>昨日新增</h3>
                                        <p><cite>{$usertol['yesterday']}</cite></p>
                                    </a>
                                </li>
                                <li class="layui-col-xs3">
                                    <a class="layadmin-backlog-body">
                                        <h3>本周新增</h3>
                                        <p><cite>{$usertol['week']}</cite></p>
                                    </a>
                                </li>
                                <li class="layui-col-xs3">
                                    <a class="layadmin-backlog-body">
                                        <h3>本月新增</h3>
                                        <p><cite>{$usertol['month']}</cite></p>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-md4">
            <div class="layui-card">
                <div class="layui-card-header">系统信息</div>
                <div class="layui-card-body layui-text">
                    <table class="layui-table">
                        <colgroup>
                            <col width="150" height="120">
                            <col>
                        </colgroup>
                        <tbody>
                        <tr>
                            <td>上次登录时间</td>
                            <td>{$access_admin['last_date']}</td>
                        </tr>
                        <tr>
                            <td>上次登录IP地址</td>
                            <td>{$access_admin['last_ip']}</td>
                        </tr>
                        <tr>
                            <td>当前系统域名</td>
                            <td>{$_SERVER['REQUEST_SCHEME']}://{$_SERVER['HTTP_HOST']}</td>
                        </tr>
                        <tr>
                            <td>运行环境</td>
                            <td>{$_SERVER["SERVER_SOFTWARE"]}</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    layui.use(['index', 'admin', 'carousel', 'echarts'], function () {
        const $ = layui.$;
        const carousel = layui.carousel;
        const element = layui.element;
        const device = layui.device();
        //轮播切换
        $('.layadmin-carousel').each(function () {
            const othis = $(this);
            carousel.render({
                elem: this,
                width: '100%',
                arrow: 'none',
                interval: othis.data('interval'),
                autoplay: othis.data('autoplay') === true,
                trigger: (device.ios || device.android) ? 'click' : 'hover',
                anim: othis.data('anim')
            });
        });
        element.render('progress');


        //没找到DOM，终止执行
        if (!elemDataView[0]) return;
        renderDataView(0);

        //监听数据概览轮播
        let carouselIndex = 0;
        carousel.on('change(LAY-index-dataview)', function (obj) {
            renderDataView(carouselIndex = obj.index);
        });

        //监听侧边伸缩
        layui.admin.on('side', function () {
            setTimeout(function () {
                renderDataView(carouselIndex);
            }, 300);
        });

        //监听路由
        layui.admin.on('hash(tab)', function () {
            layui.router().path.join('') || renderDataView(carouselIndex);
        });
    });
</script>
